<template>
  <div class="box">
    <div class="content">
      <!-- 头部 -->
      <div class="content_top">
        <h3 style="margin-left: 30px;font-size: 20px;">房屋详情</h3>
      </div>
      <div class="means">
        <p style="margin: 20px 0 0 40px;">房屋信息</p>
        <div style="margin-top: 20px;margin-left: 40px;">
          <div style="width: 25%;float: left;">
            <div>楼座：{{floorForm.building}}</div>
            <div style="margin-top: 20px;">房间用途：{{floorForm.purpose}}</div>
            <div style="margin-top: 20px;">实用面积：{{floorForm.usableArea}}㎡</div>
            <div style="margin-top: 20px;">小区：{{floorForm.floorNumber}}</div>
            <div style="margin-top: 20px;width: 1000px;">备注：{{floorForm.back}}</div>
          </div>
          <div style="width: 25%;float: left;margin-left: 100px;">
            <div>单元：{{floorForm.unit}}</div>
            <div style="margin-top: 20px;">建筑面积：{{floorForm.floorage}}</div>
            <div style="margin-top: 20px;">房间户型：{{floorForm.room}}室{{floorForm.office}}厅{{floorForm.kitchen}}厨{{floorForm.wei}}卫</div>
          </div>
          <div style="width: 25%;float: left;margin-left: 100px;">
            <div>房间号：{{floorForm.floor}}</div>
            <div style="margin-top: 20px;">公摊面积：{{floorForm.sharedArea}}</div>
            <div style="margin-top: 20px;">房屋状态：{{floorForm.houseStatus == 0?'闲置':(floorForm.houseStatus == 1?'自住':(floorForm.houseStatus == 2?'租赁':(floorForm.houseStatus == 3?'借出':'其他')))}}</div>
          </div>
        </div>
        <div style="margin: 230px 0 0 900px"><el-button @click="backspace">返回</el-button></div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'SmartPropertyVueExamine',

  data() {
    return {
      floorForm: {
        id: '',
        cid: window.sessionStorage.getItem('vid'),
        floor: '',
        floorNumber: window.sessionStorage.getItem('villageName'),
        uid: '',
        bid: '',
        purpose: '',
        floorage: '',
        sharedArea: '',
        usableArea: '',
        room: '',
        office: '',
        kitchen: '',
        wei: '',
        building: '',
        unit: '',
        parkingLotNum: '',
        storageRoom: '',
        houseStatus: '',
        back: ''
      }
    }
  },

  mounted() {
    this.floorForm = this.$route.query.floorForm
    this.floorForm.floorNumber = window.sessionStorage.getItem('villageName')
  },

  methods: {
    backspace(){
      this.$router.push('/house')
    },
    MyMessage (msg, type) {
      this.$notify({
        showClose: true,
        message: msg,
        type: type
      })
    }
  }
}
</script>

<style scoped>
.box{
  width: 100%;
  height: 1200px;
  font-family: '微软雅黑';
  background: #F0F2F5;
}
.content{
  width: 1200px;
  margin: 0 auto;
  padding-top: 25px;
}
.content_top{
  width: 100%;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
  background: #FFF;
}
.process{
  width: 100%;
  height: 200px;
  background: #FFF;
  margin-top: 20px;
  overflow: hidden;
}
.steps{
  width: 1000px;
  margin-top: 50px;
  margin-left: 40px;
}
::v-deep(.el-step__title.is-process){
  color: #8D8D8D;
}
::v-deep(.el-step__head.is-process){
  color: #8D8D8D;
}
.means{
  width: 100%;
  height: 350px;
  overflow: hidden;
  background: #FFF;
  margin-top: 20px;
}
.botton{
  width: 1200px;
  height: 250px;
  overflow: hidden;
  margin-top: 20px;
  background: #FFF;
}
</style>